<template>
    <div class="content">
        <van-form @submit="onSubmit">
            <div class="file-style">
                <van-field
                        v-model="telephone"
                        name="telephone"
                        label="联系方式"
                        placeholder="请输联系方式"
                        :maxlength="11"
                        :rules="phoneRules"
                />
                <div style="margin: 16px;">
                    <van-button round block type="info" native-type="submit">
                        获取信息
                    </van-button>
                </div>
            </div>
        </van-form>
        <template v-if="userInfo!==''||userInfo!==undefined||userInfo!==null">
            <van-cell title="场所名称" :value="userInfo.place_name"/>
            <van-cell title="场所地址" :value="userInfo.place_address"/>
            <van-cell title="联系人姓名" :value="userInfo.name"/>
            <van-cell value="方式一:"></van-cell>
            <van-cell title="下载二维码"><a :href="userInfo.qr_code">点击下载二维码</a></van-cell>
            <van-cell value="方式二:"></van-cell>
            <van-cell value="复制链接在浏览器打开"></van-cell>
            <van-cell title="长按复制链接" value="userInfo.qr_code">{{userInfo.qr_code}}</van-cell>
            <!--<a :href="userInfo.qr_code">{{userInfo.qr_code}}</a>-->
        </template>
    </div>
</template>

<script>
import { getPlaceInfoList } from '@/api/yi-qing-fang-kong.js'
export default {
  data () {
    this.phoneRules = [
      { required: true, message: '请输入联系方式' }
    ]
    return {
      userInfo: {},
      telephone: '',
      loading: false

    }
  },
  methods: {
    onSubmit () {
      console.log(this.telephone, '输入的')
      this.loading = true
      getPlaceInfoList({ mobile: this.telephone.toString().trim() }).then(ret => {
        if (ret.data.errcode === 0) {
          this.userInfo = ret.data.data
          this.loading = false
        } else {
          this.$dialog.alert({
            message: '暂无信息，请核对联系方式！'
          })
        }
      })
    }
  }
}
</script>

<style scoped>
    .file-style {
        margin: 20px;
    }

    .button-style {
        text-align: center;
        margin-top: 20px
    }

    .cell-style {
        margin: 20px;
    }
    .van-cell__value{
        text-align: left;
    }
</style>
